<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>京东商城</title>
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/index.css">
</head>
<body>
<!-- 头部 -->
<header>
    <div class="search">
        <a href="javascript:;" class="tlogo"></a>
        <input type="text" class="text" placeholder="刘强西">
        <a href="javascript:;" class="login">登录</a>
    </div>
</header>
<!--轮播图-->
<div class="silde">
    <img src="uploads/slide_1.jpg" alt="">
</div>
<!--导航区域-->
<div class="nav">
    <ul>
        <li><a href="javascript:;"><img src="images/nav_1.png" alt=""><span>Titanic</span></a></li>
        <li><a href="javascript:;"><img src="images/nav_2.png" alt=""><span>Titanic</span></a></li>
        <li><a href="javascript:;"><img src="images/nav_3.png" alt=""><span>Titanic</span></a></li>
        <li><a href="javascript:;"><img src="images/nav_4.png" alt=""><span>Titanic</span></a></li>
        <li><a href="javascript:;"><img src="images/nav_5.png" alt=""><span>Titanic</span></a></li>
        <li><a href="javascript:;"><img src="images/nav_6.png" alt=""><span>Titanic</span></a></li>
        <li><a href="javascript:;"><img src="images/nav_7.png" alt=""><span>Titanic</span></a></li>
        <li><a href="javascript:;"><img src="images/nav_8.png" alt=""><span>Titanic</span></a></li>
    </ul>
</div>
<!--限时秒杀-->
<div class="seckill">
    <div class="top">
        <div class="left">
            <a href="javascript:;">掌上秒杀</a>
            <div class="center"><span>02</span></div>
            :
            <div class="center"><span>56</span></div>
            :
            <div class="center"><span>42</span></div>
            <div class="right"><a href="javascript:;">更多秒杀</a><span></span></div>
        </div>
    </div>
    <div class="goods">
        <ul>
            <li><a href="#"><img src="uploads/seckill_1.jpg" alt=""></a><span>&yen;79</span><i>
                <del>&yen;180</del>
            </i></li>
            <li><a href="#"><img src="uploads/seckill_2.jpg" alt=""></a><span>&yen;79</span><i>
                <del>&yen;180</del>
            </i></li>
            <li><a href="#"><img src="uploads/seckill_3.jpg" alt=""></a><span>&yen;79</span><i>
                <del>&yen;180</del>
            </i></li>
        </ul>
    </div>
</div>
<!--广告区域-->
<div class="banner">
    <img src="uploads/banner_bg.jpg" alt="">
    <ul>
        <li><a href="#"><img src="uploads/banner_1.jpg" alt=""></a></li>
        <li><a href="#"><img src="uploads/banner_2.jpg" alt=""></a></li>
        <li><a href="#"><img src="uploads/banner_3.jpg" alt=""></a></li>
    </ul>


</div>
<!--商品清单-->
<div class="goodslist">
    <ul class="top">
        <li><a href="#"><img src="uploads/major_1.jpg" alt=""></a></li>
        <li><a href="#"><img src="uploads/major_2.jpg" alt=""></a></li>
        <li><a href="#"><img src="uploads/major_3.jpg" alt=""></a></li>
    </ul>
    <ul class="bottom">
        <li><a href="#"><img src="uploads/major_4.jpg" alt=""></a></li>
        <li><a href="#"><img src="uploads/major_5.jpg" alt=""></a></li>
        <li><a href="#"><img src="uploads/major_6.jpg" alt=""></a></li>
        <li><a href="#"><img src="uploads/major_7.jpg" alt=""></a></li>
    </ul>
</div>
<!--中部轮播图-->
<a href="javascript:;"><img src="uploads/advert_1.jpg" alt=""></a>
<!--特色超市-->
<div class="market">
    <div class="top">
        <a href="javascript:;">特色超市</a>
    </div>
    <div class="bottom">
        <ul>
            <li><a href="javascript:;"><img src="uploads/market_1.jpg" alt=""></a></li>
            <li><a href="javascript:;"><img src="uploads/market_2.jpg" alt=""></a></li>
            <li><a href="javascript:;"><img src="uploads/market_3.jpg" alt=""></a></li>
            <li><a href="javascript:;"><img src="uploads/market_4.jpg" alt=""></a></li>
            <li><a href="javascript:;"><img src="uploads/market_5.jpg" alt=""></a></li>
        </ul>
    </div>
</div>
<a href="javascript:;"><img src="uploads/advert_2.jpg" alt=""></a>
<div class="market">
    <div class="top">
        <a href="javascript:;">主题街</a>
    </div>
    <div class="bottom">
        <ul>
            <li><a href="javascript:;"><img src="uploads/theme_1.jpg" alt=""></a></li>
            <li><a href="javascript:;"><img src="uploads/theme_2.jpg" alt=""></a></li>
            <li class="sml"><a href="javascript:;"><img src="uploads/theme_3.jpg" alt=""></a></li>
            <li class="sml"><a href="javascript:;"><img src="uploads/theme_4.jpg" alt=""></a></li>
            <li class="sml"><a href="javascript:;"><img src="uploads/theme_5.jpg" alt=""></a></li>
            <li class="sml"><a href="javascript:;"><img src="uploads/theme_6.jpg" alt=""></a></li>
            <li class="sml"><a href="javascript:;"><img src="uploads/theme_7.jpg" alt=""></a></li>
            <li class="sml"><a href="javascript:;"><img src="uploads/theme_8.jpg" alt=""></a></li>
            <li class="sml"><a href="javascript:;"><img src="uploads/theme_9.jpg" alt=""></a></li>
            <li class="sml"><a href="javascript:;"><img src="uploads/theme_10.jpg" alt=""></a></li>
            <li class="sml"><a href="javascript:;"><img src="uploads/theme_11.jpg" alt=""></a></li>
            <li class="sml"><a href="javascript:;"><img src="uploads/theme_12.jpg" alt=""></a></li>
        </ul>
    </div>
</div>
</body>
</html>